<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
     <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";
%> 
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=9">
        <link rel="stylesheet" href="<%=basePath %>css/cssreset.css">
        <link rel="stylesheet" href="<%=basePath %>css/liuchengguanli.css">
        <link rel="stylesheet" type="text/css" href="<%=basePath %>css/easyui.css">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>css/icon.css">
		<link rel="stylesheet" type="text/css" href="<%=basePath %>css/color.css">
        <script src="<%=basePath %>js/jquery-1.11.1.min.js"></script>
        <script type="text/javascript" src="<%=basePath %>js/jquery.easyui.min.js"></script>
        <script src="<%=basePath %>js/menu.js"></script>
     </head>
     <style>
     .zcd>a{
			color:#7896b7;
			text-decoration: none;
		}
		.psxa{
			color:#708dac;
			width:100%;
			line-height:23px;
			text-align: center;
			margin-top:27px;
			font-family: '微软雅黑';
			cursor:pointer;
			font-size:16px;
		}
		.ims{
			position:relative;
			top:4px;
			right:22px;
		}
		.psxa>a{
			text-decoration:none;
			color:#708dac;
		}
     </style>
    <body>
    	<div class="headers">
    		<p class="pa">客户管理系统CRM</p>
    		<p class="rights">
	    		<img src="../images/user.png" alt="">
	    		${staff.staff_name}
	    		<button onclick="ind()"></button>
    		</p>
    	</div>
    	<section>
    		<ol class="lefts">
    			<li class="pb">
    				<img src="<%=basePath %>images/Users and permissions.png" alt="">
    				用户和权限
    				<img src="<%=basePath %>images/button (2).png" alt="">
    				<div class="div1">
    					<p class="zcd" id="zcd1"><a href="<%=basePath %>role/page.action">角色管理</a></p>
						<p class="zcd" id="zcd2"><a href="<%=basePath %>staff/selectTree.action">部门/用户管理</a></p>
    				</div>
    			</li>
    			<li class="px">
    				<img src="<%=basePath %>images/canshu.png" alt="">
    				业务参数和设定
    				<img src="<%=basePath %>images/button (2).png" alt="">
    				<div class="div1">
    					<%-- <p class="zcd" id="zcd1" name="ppa"><a href="<%=basePath %>tradeManage/select.action">行业管理</a></p>
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>compactGenre/select.action">合同类型</a></p>
                        <p class="zcd" id="zcd1" name="ppa"><a href="<%=basePath %>rank/select.action">客户级别</a></p>--%>
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>rank/select.action">申请性质</a></p> 
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>salestage/select.action">产品类别</a></p> 
                        <p class="zcd" id="zcd2" name="ppa"><a href="<%=basePath %>record/select.action">来源渠道</a></p>
    				</div>
    			</li>
    			<li class="py">
    				<img src="<%=basePath %>images/liucheng.png" alt="">
    				流程管理
    				<img src="<%=basePath %>images/button (2).png" alt="">
    				<div class="div1" style="display:block">
    					<p class="zcd" id="zcd1"><a href="<%=basePath %>approveRole/select.action" style="color:#fff">审批流程管理</a></p>
    					  <p class="zcd" id="zcd1"><a href="<%=basePath%>approve/count.action?pageSize=2" >已审批流程查看</a></p>
    				</div>
    			</li>
    			<li class="pxa">
                    <img src="../images/gonggao.png" alt="" width="18px">
                    <a href="../notice/page.action" style="color:#708dac;text-decoration: none;">公告管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
                </li>
                <li class="pxaa">
                    <img src="../images/kehu (1).png" alt="">
                    		资源开发
                    <img src="../images/button (2).png" alt="">
                    <div class="div1">
                        <p class="zcd" id="zcd1"><a href="<%=basePath %>client/weifencount.action?zhuizong=0">用户开发</a></p>
                        <p class="zcd" id="zcd2"><a href="../client/findByAllForAgent.action?start=1">代理开发</a></p>
                    </div>
                </li>
                <%--  <li class="pxas">
    				<img src="../images/kehuzilao.png" alt="">
    				客户资料
    				<img src="../images/button (2).png" alt="">
    				<div class="div1" >
    					<p class="zcd" id="zcd1"><a href="<%=basePath%>client/findByAllData.action?start=1">用户资料</a></p>
						<p class="zcd" id="zcd2"><a href="<%=basePath%>client/findByAllData.action">代理资料</a></p>
    				</div>
    			</li> --%>
    			<li class="psxa">
    				<img src="../images/operation-management.png" alt="" width="16px" class="ims">
    				<a href="<%=basePath %>Operate/count1.action">运营管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>
    			</li> 
    		</ol>
    		<div class="righta">
    			<div class="smalls">
    				<p class="pj">审批流程管理</p>
    				<div class="xiangqi">
    					<p><button>添加审批流程</button></p>
    					<table>
    						<tr class="pk">
    							<td>流程名称</td>
    							<td>说明</td>
    							<td>关联对象</td>
    							<td>对象类型</td>
    							<td>审批人</td>
    							<td></td>
    							<td></td>
    						</tr>
    							<c:forEach var="list" items="${approveRoles}">
    						<tr class="pl">
    							<td>${list.flowNme}</td>
    							<td><img src="<%=basePath %>images/liuyan.png" alt="" title="${list.remarks}"></td>
    							<td>${list.relevanceObject}</td>
    							<td>${list.typeObject}</td>
    							<td>${list.approver}</td>
    							<td><img src="<%=basePath %>images/edit.png" alt="" class="imgx" id="${list.approveRoleId}" onclick='test(this)'></td>
    							<td><img src="<%=basePath %>images/delete.png" alt="" class="imgxs" id="${list.approveRoleId}" onclick='deletes(this)'></td>
    						</tr>
    						</c:forEach>  						
    					</table>
    				</div>
    			</div>
    		</div>
    	</section>
    	<footer>
    		<div class="jiben">
    			<p>添加审批流程<img src="<%=basePath %>images/guanbi.png" alt=""></p>
    			<div class="sheding">
    				<div class="toubu">
    					<p>基本信息</p>
    				</div>
    					<form action="<%=basePath %>approveRole/insert.action" method="post"  onsubmit="return na()">
    					<p><span>流程名称&nbsp;:</span><input name="flowNme" type="text" id="names"><span>*</span></p>
    					<p>
	    					<span>关联对象&nbsp;:</span>
	    					<select name="relevanceObject id="">
	    						<option value="审核"  >审核</option>
	    					</select>
	    					<span>*</span>
	    				</p>
    					<p>
							<span>对象类型&nbsp;:</span>
	    					<select name="typeObject" id="">
	    						<option value="病假"  >病假</option>
	    						<option value="事假">事假</option>
	    						<option value="合同">合同</option>
	    						<option value="其他">其他</option>
	    					</select>
	    					<span>*</span>
    					</p>
    					<p><span>审批人(可多选)&nbsp;&nbsp;&nbsp;&nbsp;:</span><input id="cc" class="easyui-combobox" name="approver" data-options="multiple:true,valueField:'permissionID',textField:'permissionName',url:'<%=basePath %>approveRole/findStaff.action'" /></p>
    					<p><span>说明&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span><textarea name="remarks" id="" cols="30" rows="10"></textarea></p>
    					<div class="smils"><input type="submit" value="确定"></div>
    				</form>
    			</div>
    		</div>
    		<div class="jibens" id="jibens">
    			<p>编辑审批流程<img src="../images/guanbi.png" alt=""></p>
    			<div class="sheding">
    				<div class="toubu">
    					<p>基本信息</p>
    				</div>
    				<form action="<%=basePath %>approveRole/updata.action" method="post"  onsubmit="return bianji()">
    					<p><span>流程名称&nbsp;:</span><input name="flowNme" type="text" id="user"><span>*</span></p>
    					<p>
	    					<span>关联对象&nbsp;:</span>
	    					<select name="relevanceObject" id="relevanceObject">
	    						<option value="审核"  >审核</option>
	    					</select>
	    					<span>*</span>
	    				</p>
    					<p>
							<span>对象类型&nbsp;:</span>
	    					<select name="typeObject" id="typeObject">
	    						<option value="病假">病假</option>
	    						<option value="事假">事假</option>
	    						<option value="合同">合同</option>
	    						<option value="其他">其他</option>
	    					</select>
	    					<span>*</span>
    					</p>
    				<p><span>审批人(可多选)&nbsp;&nbsp;&nbsp;&nbsp;:</span><input id="cs" type="text" class="easyui-combobox" name="approver" data-options="multiple:true,valueField:'permissionID',textField:'permissionName',url:'<%=basePath %>approveRole/findStaff.action'" /></p>
    					<p><span>说明&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:</span><textarea name="remarks" id="remarks" cols="30" rows="10"></textarea></p>
    					<input name="approveRoleId" type="text" id="hiddens" style="display:none">
    					<div class="smils"><input type="submit" value="确定"></div>
    				</form>
    			</div>
    		</div>
    	</footer>
    	<div class="smallas"></div>
    </body>
    <script>
    function show(){
		window.location.href="<%=basePath %>approve/Findnoapprove.action";
  }
    	$('.xiangqi>p>button').click(function(event) {
    		$('.jiben').css('display', 'block');
    		$('.smallas').css('display', 'block');
    	});
    	$('.jiben>p>img').click(function(event) {
    		$('.jiben').css('display', 'none');
    		$('.smallas').css('display', 'none');
    	});
    	$('.fota>img').click(function(event) {
    		$('.foota').css('display', 'none');
    		$('.smallas').css('display', 'none');
    	});
    	$('.fotb>p:nth-of-type(1)').click(function(event) {
    		$('.jiben').css('display', 'block');
    		$('.foota').css('display', 'none');
    	});
    	$('.imgx').click(function(event) {
    		$('.jibens').css('display', 'block');
    		$('.smallas').css('display', 'block');
    		
    	});
    	$('.jibens>p>img').click(function(event) {
    		$('.jibens').css('display', 'none');
    		$('.smallas').css('display', 'none');
    	});
    	
     function test(obj){
     	$.ajax({
     		url: '<%=basePath %>approveRole/findId.action',
     		type: 'post',
     		data: {id: obj.id},
     		success:function(data){
                var data=eval('('+data+')');
     			$('#user').val(data[0].flowNme);
     		/* 	document.getElemetById('#relevanceObject').innerHTML=data[0].relevanceObject;
     			document.getElemetById('#typeObject').innerHTML=data[0].relevanceObject; */
     			  $('#cs').combobox('setValues',data[0].approver); 
     			$('#remarks').val(data[0].remarks);
     		}
     	});
     	$('#hiddens').val(obj.id);
     }
     function deletes(obj){
    	 var s=obj.id;
    	 window.location.href="<%=basePath %>approveRole/delete.action?id="+s;
     }
     var names=document.getElementById('names');
     var ccs=document.getElementById('cc');
     
     /*添加  */
     function na(){
    	 var nam=names.value;
    	 var val=true;
    	 var pattern= /\s/;
    	 if(nam==''||pattern.test(txts)){
    		 alert('请输入流程名称！');
    		 val=val&&false;
    	 }
    	 
    	 var sh = $('#cc').combobox('options');
    	 if(sh==null){
    		 alert('请选择审批人！');
    		 val=val&&false;
    	 }
    	 return val;
     }
     names.onblur=function(){
    	 var na=names.value;
    	 var pattern= /\s/;
    	 if(na==''||pattern.test(na)){
    		 alert('请输入流程名称！');
    	 }
     }
     cc.onblur=function(){
    	 var pattern= /\s/;
    	 var ss=$('#cc').combobox('options');
    	 if(ss==''||pattern.test(ss)){
    		 alert('请选择审批人！');
    	 }
     }
     
     
     /*编辑  */
     var use=document.getElementById('user');
     var cas=document.getElementById('cs');
     function bianji(){
    	 var val=true;
    	 var usvl=use.value;
    	 var pattern= /\s/;
    	 if(usvl==''||pattern.test(usvl)){
    		 alert('流程名称不能为空！');
    		 val=val&&false;
    	 }
    	 var ccas=$('#cc').combobox('options');
    	 if(csas==''||pattern.test(csas)){
    		 alert('请选择审批人！');
    		 val=val&&false;
    	 }
    	 return val;
     }
     use.onblur=function(){
    	 var usa=ues.value;
    	 var pattern= /\s/;
    	 if(usa==''||pattern.test(usa)){
    		 alert('请输入流程名称！');
    	 }
     }
     cas.onblur=function(){
    	 var cas=ccs.value;
    	 var pattern= /\s/;
    	 if(cas==''||pattern.test(cas)){
    		 alert('请选择审批人！');
    	 }
     }
     function ind(){
     	window.location.href= "../notice/findByAll.action";
     }
    </script>
</html>